<template>
  <div id="app">
    <div class="linkBar">
      <router-link class="chinaMap" to="/China_Map">国内疫情</router-link>
      <div class="verticalBar"></div>
      <router-link class="worldMap" to="/World_Map">全球疫情</router-link>
    </div>
    <div class="chart">
      <router-view></router-view>
    </div>
  </div>
</template>

<style>
  #app{
    text-align: center;
  }

  .linkBar{
    margin: 50px 0;
    font-size: 26px;
  }

  .verticalBar {
        width: 2px;
        height: 40px;
        background: rgb(180, 180, 180);
        display: inline-block;
        /* margin-top: 31px; */
        vertical-align: top;
        margin-right: 29px;
        margin-left: 30px;
    }
    
  a{
    text-decoration: none;
  }

  .router-link-active{
    color: rgb(168, 3, 3);
  }
</style>